<!DOCTYPE html>
<html lang="zh-CN">

<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>vue</title>
   <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
   </style>
</head>

<body>
   <div id="root">
      <input type="password" placeholder="按下tab提示输入" v-model="id" @keydown.tab.prevent='e1'>
   </div>
   <!-- 不常用的是用key和keycode来绑定，如@keyup.caps-lock -->
   <!-- v3已经废弃keycode -->
   <!-- tab按键很特殊，不等抬起来，就会切走焦点 -->
   <!-- 系统修饰键：keyup按下按键，按下其他键，松开其他键后才会触发事件(松开其他键才算摁了),keydown则正常 -->
   <!-- 同时摁下keyup.ctrl.a -->
   <script>
      const vm = new Vue({
         el: '#root',
         data: {
            name: 'chen',
            id: '3200541011'
         },
         methods: {
            // e1(e) {
            //    if (e.keyCode !== 13) return
            //    console.log(e.target.value);
            // },传统方法
            e1(e) {
               console.log(e.target.value);
            },
         }
      })
   </script>
</body>

</html>
